/**
 * Created by liold on 2014/12/11.
 */
var offsetTop = 0;  //132;

function fixTable(tableId, fixColumnNumber, width, height) {

    if ($("#" + tableId + "_tableLayout").length != 0) {
        $("#" + tableId + "_tableLayout").before($("#" + tableId));
        $("#" + tableId + "_tableLayout").empty();
    }
    else {
        $("#" + tableId).after("<div id='" + tableId + "_tableLayout' style='overflow:hidden; width:" + width + "px;'></div>");
    }
    $('<div id="' + tableId + '_tableFix"></div>'
    + '<div id="' + tableId + '_tableHead"></div>'
    + '<div id="' + tableId + '_tableColumn"></div>'
    + '<div id="' + tableId + '_tableData"></div>').appendTo("#" + tableId + "_tableLayout");
    var oldTable = $("#" + tableId);
    var tableLayout = $("#" + tableId + "_tableLayout");
    var tableFixBox = $("#" + tableId + "_tableFix");
    var tableHeadBox = $("#" + tableId + "_tableHead");
    var tableColumnBox = $("#" + tableId + "_tableColumn");
    var tableDataBox = $("#" + tableId + "_tableData");

    var tableFixClone = oldTable.clone(true);
    tableFixClone.attr("id", tableId + "_tableFixClone");
    tableFixBox.append(tableFixClone);

    var tableHeadClone = oldTable.clone(true);
    tableHeadClone.attr("id", tableId + "_tableHeadClone");
    tableHeadBox.append(tableHeadClone);

    var tableColumnClone = oldTable.clone(true);
    tableColumnClone.attr("id", tableId + "_tableColumnClone");
    tableColumnBox.append(tableColumnClone);

    tableDataBox.append(oldTable);
    $("#" + tableId + "_tableLayout table").each(function () {
        $(this).css("margin", "0");
    });

    var headHeight = $("#" + tableId + "_tableHead thead").height();
    headHeight += 2;
    tableHeadBox.css("height", headHeight);
    tableFixBox.css("height", headHeight);

    var columnsWidth = 0;
    var columnsNumber = 0;
    $("#" + tableId + "_tableColumn tr:first td:lt(" + fixColumnNumber + ")").each(function () {
        columnsWidth += $(this).outerWidth(true);
        columnsNumber++;
    });
    columnsWidth += 2;

    //if ($.browser.msie) {
    //    switch ($.browser.version) {
    //        case "7.0":
    //            if (columnsNumber >= 3) columnsWidth--;
    //            break;
    //        case "8.0":
    //            if (columnsNumber >= 2) columnsWidth--;
    //            break;
    //    }
    //}

    tableColumnBox.css("width", columnsWidth);
    tableFixBox.css("width", columnsWidth);

    tableFixBox.css({
        "overflow": "hidden",
        "position": "absolute",
        "z-index": "50",
        "background-color": "#fff"
    });
    tableHeadBox.css({
        "overflow": "hidden",
        "width": width,
        "position": "absolute",
        "z-index": "45",
        "background-color": "#fff"
    });
    tableColumnBox.css({
        "overflow": "hidden",
        //"height": oldTable.outerWidth(true) < width ? height : height - 17,
        "position": "absolute",
        "z-index": "40",
        "background-color": "#fff"
    });
    tableDataBox.css({
        "overflow": "auto",
        "width": width,
        //"height": height,
        "position": "absolute",
        "z-index": "35"
    });

    var tableFixTableWidth = $("#" + tableId + "_tableFix table").width();
    if (tableHeadBox.width() > tableFixTableWidth) {
        tableHeadBox.css("width", tableFixTableWidth);
        tableDataBox.css("width", tableFixTableWidth);
    }

    var tableColumnTableHeight = $("#" + tableId + "_tableColumn table").height();
    if (tableColumnBox.height() > tableColumnTableHeight) {
        tableColumnBox.css("height", tableColumnTableHeight);
        tableDataBox.css("height", tableColumnTableHeight + 20);
        tableLayout.css("height", tableColumnTableHeight + 20);
    }


    //var tableLayoutOffset = tableLayout.offset();

    //tableFix.offset(tableLayoutOffset);
    //tableHead.offset(tableLayoutOffset);
    //tableColumn.offset(tableLayoutOffset);
    //tableData.offset(tableLayoutOffset);

    //tableData.scroll(function () {
    //    tableHead.scrollLeft(tableData.scrollLeft());
    //    tableColumn.scrollTop(tableData.scrollTop());
    //});


    //====== 超过可视区域显示处理

    var tableHeadOffsetTop = tableHeadBox.offset().top;
    var tmpTableFix = tableFixBox.clone(true);
    var tmpTableHeadBox = tableHeadBox.clone(true);

    // 上边距
    var topDistance = tableHeadOffsetTop - $(window).scrollTop();
    var tmpTopDistance = topDistance;

    if (topDistance > 0) {
        tmpTableFix.hide();
        tmpTableHeadBox.hide();
    }

    tmpTableFix.css({
        position: "fixed",
        top: "0px",
        left: tableLayout.offset().left + "px"
    });
    tableLayout.append(tmpTableFix);

    tmpTableHeadBox.css({
        position: "fixed",
        top: "0px",
        left: tableLayout.offset().left + "px"
    });
    tableLayout.append(tmpTableHeadBox);

    // 下边距
    var bottomDistance = $(window).height() + $(window).scrollTop() - (tableLayout.offset().top + tableLayout.height());

    // 横向滚动条
    var bw = tableFixTableWidth + 2;
    $('<div id="' + tableId + '_tmpScrollBar"><div style="width: ' + bw + 'px">.</div></div>').appendTo(tableLayout);

    var bottomScrollBarFixed = $("#" + tableId + "_tmpScrollBar");
    if (bottomDistance > 0) {
        bottomScrollBarFixed.hide();
    }
    bottomScrollBarFixed.css({
        "position": "fixed",
        "overflow": "auto",
        "overflow-y": "hidden",
        "width": width,
        "height": "17px",
        "z-index": "60",
        "bottom": 0,
        "font-size": "1px",
        "left": tableLayout.offset().left + "px"
    });

    bottomScrollBarFixed.scroll(function () {
        tableHeadBox.scrollLeft(bottomScrollBarFixed.scrollLeft());
        tmpTableHeadBox.scrollLeft(bottomScrollBarFixed.scrollLeft());
        tableDataBox.scrollLeft(bottomScrollBarFixed.scrollLeft());
    });

    tableDataBox.scroll(function () {
        tableHeadBox.scrollLeft(tableDataBox.scrollLeft());
        tmpTableHeadBox.scrollLeft(tableDataBox.scrollLeft());
        tableColumnBox.scrollTop(tableDataBox.scrollTop());
    });

    $(window).scroll(
        function () {
            var scrollTop = $(window).scrollTop();
            topDistance = tableHeadBox.offset().top - scrollTop - offsetTop;

            // 上边出可视区域
            if (topDistance < 0) {
                // 只设置一次
                if (tmpTopDistance >= 0) {
                    tmpTableFix.show();

                    tmpTableHeadBox.show();
                    tmpTableHeadBox.scrollLeft(tableDataBox.scrollLeft());
                    tmpTableHeadBox.css("top", offsetTop + "px");
                    tmpTableFix.css("top", offsetTop + "px");
                    tmpTopDistance = topDistance;
                }
            }
            else {
                if (tmpTopDistance < 0) {
                    tmpTableFix.hide();
                    tmpTableHeadBox.hide();
                    tmpTopDistance = topDistance;
                }
            }


            //下边距计算
            bottomDistance = $(window).height() + scrollTop - (tableLayout.offset().top + tableLayout.height());
            if (bottomDistance < 0) {
                bottomScrollBarFixed.show();
                bottomScrollBarFixed.scrollLeft(tableDataBox.scrollLeft());
            }
            else {
                bottomScrollBarFixed.hide();
            }
        }
    );

    $(window).resize(function () {
        var tableHeadOffsetLeft = tableHeadBox.offset().left;

        tmpTableFix.css("left", tableHeadOffsetLeft);
        tmpTableHeadBox.css("left", tableHeadOffsetLeft);
        bottomScrollBarFixed.css("left", tableHeadOffsetLeft);
    });
}